<template>
  <div>
    <el-row>
      <el-button
        icon="el-icon-refresh"
        type="primary"
        plain
        size="mini"
        @click="openData()"
        >刷新</el-button
      >
      <el-button
        icon="el-icon-circle-plus-outline"
        type="warning"
        plain
        size="mini"
        @click="onSetAdd()"
        :disabled="!zIsOpenData"
        >新增流程</el-button
      >
    </el-row>
    <!--  -->
    <el-dialog
      title="增加流程"
      v-model="FIsShowSetEidt"
      :close-on-click-modal="false"
      destroy-on-close
    >
      <el-form model="FIndexSet">
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="流程代码">
              <el-input
                placeholder="请输入流程代码"
                v-model="FIndexSet.FSetCode"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="流程名称">
              <el-input
                placeholder="请输入流程名称"
                v-model="FIndexSet.FSetName"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <div align="center">高级功能,自定义实际业务步骤保存在哪</div>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="保存表名">
              <el-input
                placeholder="自定义步骤保存表名"
                v-model="FIndexSet.FTableName"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="保存主键">
              <el-input
                placeholder="自定义步骤保存主键"
                v-model="FIndexSet.FKeyFieldName"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="启用">
          <el-switch
            v-model="FIndexSet.FIsUse"
            active-color="#13ce66"
            inactive-color="#ff4949"
          ></el-switch>
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="FIsShowSetEidt = false">取 消</el-button>
          <el-button type="primary" @click="saveSet()">确 定</el-button>
        </span>
      </template>
    </el-dialog>
    <!--  -->
    <el-table
      :data="FProcessSetList"
      style="width: 99%; margin-top: 10px; margin-bottom: 20px"
      row-key="FSetID"
      border
      highlight-current-row
    >
      <el-table-column prop="FSetCode" label="流程代码"> </el-table-column>
      <el-table-column prop="FSetName" label="流程名称"> </el-table-column>
      <el-table-column prop="FTableName" label="保存表名"></el-table-column>
      <el-table-column prop="FKeyFieldName" label="保存主键"> </el-table-column>
      <el-table-column prop="FIsUse" label="启用"> </el-table-column>
      <el-table-column label="操作">
        <template #default="scope">
          <el-button
            type="primary"
            plain
            size="mini"
            @click="onSetEdit(scope.row)"
            >编辑</el-button
          >
          <el-button
            type="primary"
            plain
            size="mini"
            @click="onStepEdit(scope.$index, scope.row)"
            >步骤设计</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script  lang="ts">
import { Options, Vue } from "vue-class-component";
import TFormBase from "@/views/BaseForm";
import { TProcessSet } from "@/baselib/module/BaseClass";
//配合着用
@Options({
  name: "TFormProcessSetList",
})
export default class TFormProcessSetList extends TFormBase {
  private FIsShowSetEidt: boolean = false;
  private FProcessSetList: TProcessSet[] = [];
  private FIndexSet: TProcessSet = new TProcessSet();
  public created() {
    this.openData();
  }
  //打开数据
  private async openData() {
    this.zIsOpenData = false;
    var lResult = await this.$myModuleAPI.GetProcessSetList();
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgDialog(lResult.resultMsg);
      return;
    }
    this.FProcessSetList = lResult.resultData;
    this.zIsOpenData = true;
    this.$myMsgHelp.msgHintAutoClose("打开数据成功");
  }
  private onSetAdd() {
    this.FIndexSet = new TProcessSet();
    this.FIsShowSetEidt = true;
  }
  private onSetEdit(qSet: TProcessSet) {
    this.FIndexSet = qSet;
    this.FIsShowSetEidt = true;
  }
  private async saveSet() {
    let lResult = await this.$myModuleAPI.SaveProcessSet(this.FIndexSet);
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgDialog(lResult.resultMsg);
      return;
    }
    this.FIsShowSetEidt = false;
    this.$myMsgHelp.msgHintAutoClose("保存数据成功");
    this.openData();
  }
}
</script>